<template>
<el-container>
  <el-header>
    <h1>缓存管理</h1>
  </el-header>
  <el-main  v-loading.fullscreen.lock="loading">
    <el-form
        :inline="true"
        class="demo-form-inline"
    >
        <el-form-item label="缓存Key">
            <el-input
                v-model="CacheKey"
                placeholder="缓存Key"
            ></el-input>
        </el-form-item>
        <el-form-item>
            <el-button
                type="primary"
                @click="GetCacheConent"
            >查询</el-button>
        </el-form-item>
        <el-form-item>
            <el-button
                type="primary"
                @click="ClearCache"
            >清除</el-button>
        </el-form-item>
        </el-form>
        <div>
          {{CacheConents==null?'{}':JSON.stringify(CacheConents)}}
        </div>
    </el-main>
</el-container>
</template>

<script>
export default {
  data() {
    return {
      CacheKey: "",
      CacheConents: null,
      loading: false
    };
  },
  mounted() {},
  methods: {
    GetCacheConent() {
      this.loading = true;
      this.$ajax.GetCache({ key: this.CacheKey }).then(res => {
        this.loading = false;
        if (res.Success) {
          this.CacheConents = res.Data;
        } else {
          this.$message.error(res.ErrorMsg);
          this.CacheConents = null;
        }
      });
    },
    ClearCache() {
      this.loading = true;
      this.$ajax.RemoveCache({ key: this.CacheKey }).then(res => {
        this.loading = false;
        if (res.Success) {
          this.$message({
            message: "清除完成",
            type: "success"
          });
          this.CacheConents = null;
        } else {
          this.$message.error(res.ErrorMsg);
        }
      });
    }
  }
};
</script>
